﻿@model PSU.Model.Areas.Instructor.Home.IndexViewModel
@{
    ViewData["Title"] = "我的首页";
    ViewData["NavTitle"] = "数据全局概览";
    ViewData["CurrName"] = "";
}

<section class="content-header">
    <h1>
        数据中心
        <small>Data Center</small>
    </h1>
    <ol class="breadcrumb">
        <li>
            <a asp-area="Instructor" asp-controller="Home" asp-action="Index">
                <i class="fa fa-dashboard"></i> 首页
            </a>
        </li>
        <li class="active">数据中心</li>
    </ol>
</section>

<section class="content">
    <div class="row">
        <div class="col-lg-3 col-xs-6">
            <div class="small-box bg-aqua">
                <div class="inner">
                    <h3>@Model.TodayEnrollmentCount</h3>

                    <p>今日报名人数</p>
                </div>
                <div class="icon">
                    <i class="ion ion-ios-people-outline"></i>
                </div>

            </div>
        </div>

        <div class="col-lg-3 col-xs-6">
            <div class="small-box bg-teal">
                <div class="inner">
                    <h3>@Model.YesterdayEnrollmentCount</h3>

                    <p>昨日报名人数</p>
                </div>
                <div class="icon">
                    <i class="ion ion-person-add"></i>
                </div>

            </div>
        </div>

        <div class="col-lg-3 col-xs-6">
            <div class="small-box bg-yellow">
                <div class="inner">
                    <h3>@Model.QuestionCount</h3>

                    <p>学生提问总数</p>
                </div>
                <div class="icon">
                    <i class="ion ion-android-notifications"></i>
                </div>

            </div>
        </div>

        <div class="col-lg-3 col-xs-6">
            <div class="small-box bg-green">
                <div class="inner">
                    <h3>@Model.Proportion<sup style="font-size: 20px">%</sup></h3>

                    <p>完成报名比例</p>
                </div>
                <div class="icon">
                    <i class="ion ion-pie-graph"></i>
                </div>

            </div>
        </div>
    </div>

    <div class="row">
        <!-- Left Col -->
        <section class="col-lg-7 connectedSortable">
            <!-- Line Chart -->
            <div class="nav-tabs-custom">
                <ul class="nav nav-tabs pull-right">
                    <li class="pull-left header"><i class="fa fa-line-chart"></i> 报名人数走势 </li>
                </ul>
                <div class="tab-content no-padding">
                    <div class="chart tab-pane active" id="register-line-chart" style="position: relative; height: 300px;"></div>
                </div>
            </div>
            <!-- /.Line Chart -->
            <!-- Question box -->
            <div class="box box-success">
                <div class="box-header">
                    <i class="fa fa-comments-o"></i>

                    <h3 class="box-title">学生疑问</h3>
                </div>
                <div class="box-body chat" id="chat-box">
                    @{
                        if (Model != null && Model.QuestionList.Any())
                        {
                            foreach (var item in Model.QuestionList)
                            {
                                <div class="item">
                                    <div class="message-not-iamge">
                                        <a href="#" class="name">
                                            <small class="text-muted pull-right"><i class="fa fa-clock-o"></i> @item.DateTime</small>
                                            <i class="fa fa-paper-plane"></i>&nbsp;&nbsp;
                                            @item.Name
                                        </a>
                                        <p class="message-content">
                                            @Html.Raw(item.Content)
                                        </p>
                                    </div>
                                </div>
                            }
                        }
                    }
                </div>
                <!-- /.chat -->
                <div class="box-footer">
                    <a class="btn btn-default pull-right" asp-area="Instructor" asp-controller="Question" asp-action="Information">
                        <i class="fa fa-hand-o-right"></i> 查看更多
                    </a>
                </div>
            </div>
            <!-- /.Question Box -->
        </section>
        <!-- /.Left Col -->
        <!-- Right Col -->
        <section class="col-lg-5 connectedSortable">
            <!-- Bulletin Box -->
            <div class="box box-info">
                <div class="box-header">
                    <i class="ion ion-clipboard"></i>
                    <h3 class="box-title">公告 & 政策</h3>

                    <div class="pull-right box-tools">
                        <button type="button" class="btn btn-default btn-sm pull-right" data-widget="collapse"
                                data-toggle="tooltip" title="折叠" style="margin-right: 5px;">
                            <i class="fa fa-minus"></i>
                        </button>
                    </div>
                </div>
                <div class="box-body">
                    <ul class="todo-list">
                        @{
                            if (Model != null && Model.BulletinList.Any())
                            {
                                foreach (var item in Model.BulletinList)
                                {
                                    <li>
                                        <i class="fa fa-bullhorn" aria-hidden="true"></i>
                                        <span class="text">
                                            <a href="/Instructor/Home/Detail/@item.Id">@item.Title</a>
                                        </span>
                                    </li>
                                }
                            }
                        }
                    </ul>
                </div>
                <div class="box-footer clearfix">
                    <a class="btn btn-default pull-right" asp-area="Instructor" asp-controller="Home" asp-action="Bulletin">
                        <i class="fa fa-hand-o-right"></i> 查看更多
                    </a>
                </div>
            </div>
            <!-- /.Bulletin Box -->
            <!-- Map box -->
            <div class="box box-solid">
                <div class="box-header">
                    <i class="fa fa-map-marker"></i>

                    <h3 class="box-title">
                        新生生源地分布
                    </h3>
                </div>
                <div class="box-body">
                    <div id="map-pie" style="height: 350px; width: 100%;"></div>
                </div>
            </div>
        </section>
        <!-- Right Col -->
    </div>
</section>

@section scripts{
    <environment include="Development">
        <script src="~/javascript/template/echarts.common.min.js"></script>
        <script src="~/javascript/template/macarons.js"></script>
        <script src="~/javascript/view/Instructor/index.js"></script>
    </environment>
    <environment exclude="Development">
        <script src="~/javascript/view/Instructor/index.min.js" asp-append-version="true"></script>
    </environment>
}